import 'package:flutter/material.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';
import 'package:flutterproject/mvvm/base/base_state.dart';
import 'package:flutterproject/page/announce/announce_page.dart';
import 'package:flutterproject/page/main/children/share/share_page.dart';
import 'package:flutterproject/page/main/controller/main_controller.dart';
import 'package:flutterproject/page/product_detail/product_detail_page.dart';
import 'package:flutterproject/util/extension/extension_util.dart';
import 'package:flutterproject/util/extension/widget_extension.dart';
import 'package:flutterproject/util/margin_padding_util.dart';
import 'package:flutterproject/widget/image_extended.dart';
import 'package:flutterproject/widget/marquee_vertical.dart';
import 'package:flutterproject/widget/text/text_common.dart';
import 'package:get/get.dart';

class MainPage extends BaseState<MainController> {
  @override
  Widget initView(BuildContext context) {
    return ColoredBox(
      color: Color(0xFFF6F6F6),
      child: SingleChildScrollView(
        child: Stack(
          children: [
            ImageCommon(
              "/image/main_bg",
              width: 720.width,
              height: 278.height,
            ),
            Container(
              padding: MarginPaddingUtil.symmetric(horizontal: 20),
              margin: MarginPaddingUtil.only(top: 83, bottom: 20),
              width: Get.width,
              child: Column(
                children: [
                  if ((controller.productBean?.banners?.length ?? 0) > 0)
                    SizedBox(
                      width: 680.width,
                      height: 320.height,
                      child: Swiper(
                        itemCount: controller.productBean?.banners?.length ?? 0,
                        autoplay: true,
                        itemBuilder: (BuildContext context, int index) {
                          return ImageCommon(
                            controller.productBean!.banners![index].imageUrl,
                            circular: 20.radius,
                          );
                        },
                      ),
                    ),
                  16.heightBox,
                  Container(
                    width: Get.width - 60.width,
                    padding: MarginPaddingUtil.symmetric(
                        horizontal: 20, vertical: 13),
                    decoration: BoxDecoration(
                        color: Color(0xFFE9E9E9),
                        borderRadius: BorderRadius.circular(20.sp)),
                    child: Row(
                      children: [
                        ImageCommon(
                          "/icon/horn",
                          width: 38.width,
                          height: 34.height,
                          fit: BoxFit.fill,
                        ),
                        27.widthBox,
                        SizedBox(
                          width: Get.width - 100,
                          child: MarqueeVertical(
                            itemCount: controller.list.length,
                            lineHeight: 24.sp,
                            itemBuilder: (index) {
                              return TextCommon(
                                controller.list[index],
                                size: 24.sp,
                                color: Color(0xFF414141),
                                maxLines: 1,
                              );
                            },
                            scrollDuration: const Duration(milliseconds: 300),
                            onPress: (index) {
                              Get.to(() => AnnouncePage(
                                    list: controller.noticeList ?? [],
                                  ));
                            },
                          ),
                        ),
                      ],
                    ),
                  ).addClickEvent(() => Get.to(() => AnnouncePage(
                        list: controller.noticeList ?? [],
                      ))),
                  35.heightBox,
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      _buildImageText("/icon/icon_buy", "购物专区"),
                      _buildImageText("/icon/icon_hot", "爆品专区"),
                      _buildImageText("/image/ic_huiyuan", "会员活动"),
                      _buildImageText("/icon/icon_wine", "酒业生态"),
                      _buildImageText("/icon/icon_info", "分享好友")
                          .addClickEvent(() {
                        Get.to(SharePage());
                      }),
                    ],
                  ),
                  24.heightBox,
                  ImageCommon(
                    "/image/main_ad",
                    width: 680.width,
                    height: 164.width,
                  ).addClickEvent(() {
                    Get.to(SharePage());
                  }),
                  16.heightBox,

                  ImageCommon(
                    "/image/ic_banner_1",
                    width: 680.width,
                    height: 230.width,
                  ).addClickEvent(() {
                    Get.to(
                        ProductDetailPage(
                          heroTag: 'test0',
                        ),
                        arguments: {
                          "id": controller.productBean?.products?[0].id,
                          "name": controller.imageList[0]
                        });
                  }),
                  12.heightBox,
                  ImageCommon(
                    "/image/ic_banner_2",
                    width: 680.width,
                    height: 230.width,
                  ).addClickEvent(() {
                    Get.to(
                        ProductDetailPage(
                          heroTag: 'test1',
                        ),
                        arguments: {
                          "id": controller.productBean?.products?[1].id,
                          "name": controller.imageList[1]
                        });
                  }),
                  12.heightBox,
                  ImageCommon(
                    "/image/ic_banner_3",
                    width: 680.width,
                    height: 230.width,
                  ).addClickEvent(() {
                    Get.to(
                        ProductDetailPage(
                          heroTag: 'test2',
                        ),
                        arguments: {
                          "id": controller.productBean?.products?[2].id,
                          "name": controller.imageList[2]
                        });
                  }),
                  12.heightBox,
                  ImageCommon(
                    "/image/ic_banner_4",
                    width: 680.width,
                    height: 230.width,
                  ).addClickEvent(() {
                    Get.to(
                        ProductDetailPage(
                          heroTag: 'test3',
                        ),
                        arguments: {
                          "id": controller.productBean?.products?[3].id,
                          "name": controller.imageList[3]
                        });
                  }),
                  // GridView.builder(
                  //     padding: EdgeInsets.zero,
                  //     itemCount: controller.productBean?.products?.length ?? 0,
                  //     physics: NeverScrollableScrollPhysics(),
                  //     gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  //         crossAxisCount: 2,
                  //         crossAxisSpacing: 20.width,
                  //         mainAxisSpacing: 15.height,
                  //         childAspectRatio: 320 / 520),
                  //     shrinkWrap: true,
                  //     itemBuilder: (context, index) {
                  //       final bean = controller.productBean?.products![index];
                  //       return GestureDetector(
                  //         onTap: () => Get.to(
                  //             ProductDetailPage(
                  //               heroTag: 'test$index',
                  //             ),
                  //             arguments: {
                  //               "id": bean?.id,
                  //               "name": controller.imageList[index]
                  //             }),
                  //         child: Container(
                  //           decoration: BoxDecoration(
                  //             borderRadius: BorderRadius.circular(10.sp),
                  //             color: Colors.white,
                  //           ),
                  //           child: Column(
                  //             crossAxisAlignment: CrossAxisAlignment.start,
                  //             children: [
                  //               Hero(
                  //                 tag: 'test$index',
                  //                 child: ImageCommon(
                  //                   "/image/${controller.imageList[index]}_1",
                  //                   width: 320.width,
                  //                   height: 320.width,
                  //                 ),
                  //               ),
                  //               Padding(
                  //                 padding: MarginPaddingUtil.symmetric(
                  //                     horizontal: 15),
                  //                 child: Column(
                  //                   crossAxisAlignment:
                  //                       CrossAxisAlignment.start,
                  //                   children: [
                  //                     17.heightBox,
                  //                     TextCommon(
                  //                       bean?.title ?? "",
                  //                       size: 28.sp,
                  //                       color: Color(0xFF414141),
                  //                     ),
                  //                     17.heightBox,
                  //                     TextCommon(
                  //                       bean?.description ?? "",
                  //                       maxLines: 3,
                  //                       color: Color(0xFFA8A8A8),
                  //                       size: 24.sp,
                  //                       lineHeight: 28.sp,
                  //                     ),
                  //                     25.heightBox,
                  //                     TextCommon(
                  //                       "${bean?.price ?? 0}",
                  //                       color: Color(0xFFE04D4D),
                  //                       size: 28.sp,
                  //                       fontWeight: FontWeight.bold,
                  //                     ),
                  //                   ],
                  //                 ),
                  //               )
                  //             ],
                  //           ),
                  //         ),
                  //       );
                  //     })
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  MainController initController() => MainController();

  Widget _buildImageText(String image, String text) {
    return Column(children: [
      ImageCommon(
        image,
        size: 118.sp,
      ),
      TextCommon(
        text,
        color: Color(0xFF414141),
      )
    ]);
  }
}
